let layer = layui.layer
let form = layui.form
let laypage = layui.laypage;


// 获取文章列表下拉框
axios.get('/my/article/cates').then(({ data: { data } }) => {
  // console.log(res)
  $('[name="cate_id"]').append(data.map(({ name, Id }) =>
    `<option value="${Id}">${name}</option>`
  ).join(''))

  form.render('select')//刷新select选择框渲染
})





// 实现修改文章
// axios.get('/my/article/:id')
let id = location.search.split('?id=')[1]

axios.get('/my/article/' + id).then(({ data: {data } }) => {

  form.val('formTest',data)
})

// 富文本编辑器
const E = window.wangEditor
const editor = new E('#contentBox')
editor.config.zIndex = 1
// 或者 const editor = new E( document.getElementById('div1') )
editor.create()

// 更换图片裁剪效果
// 1. 获取裁剪区域的 DOM 元素
let $image = $(".container img");

// 2. 裁剪选项
let options = {
  aspectRatio: 400 / 280,
  preview: '.preview'
}
// 3. 初始化裁剪区域
$image.cropper(options)

// 点击·选择封面·弹出框，用户选择文件
$('#btnChooseCoverImage').on('click', () => {
  $('#fileCover').click()
})
// 给文件域注册change事件，更换裁切区域的图片
$('#fileCover').on('change', function () {
  // 1. 找到选择的图片（文件对象）
  let file = this.files[0]; // 我们选择的图片的文件对象

  if (!file) {
    return layer.msg('请选择文件')
  }
  // 2. 根据文件对象，生成一个临时的url，用于访问被选择的图片
  let url = URL.createObjectURL(file)

  // 3. 更换剪裁区的图片的src属性
  // - 销毁原理的剪裁区
  // - 更换图片
  // - 重新创建剪裁区
  $image.cropper('destroy').attr('src', url).cropper(options);
});

